import React from 'react'
import {connect} from 'dva';
import { routerRedux } from 'dva/router';
import style from './index.less'
import { Breadcrumb, TableView, RelativeBox, TableButton, FilterBox} from './../../components/cor'
import {Form, Input, Checkbox, Icon} from 'antd';
const FormItem = Form.Item;
function list({dispatch ,list}) {
  const {dataSource, filterBoxShowFlag, filterParam, pageParam, foundStage, param, sorts, loading, total} = list;
  const Breadcrumbs = {
    dispatch,
    data: [
      {item:'首页'},
      {item:'列表'}
    ]
  };
  const actionTypeHead = 'list/';
  const detailUrl = '#/home/';
  const rowKey = 'id';
  const tableViewProps = {
    loading: loading,
    rowKey: rowKey,
    linkHead: detailUrl,
    onChange: function (e, filters, sorter) {
      if (sorter.field== 'createdOn') {
        var timer = !sorts.timer;
        dispatch({
          type: actionTypeHead + 'fetch',
          payload: {
            pageParam: {
              ...pageParam,
            },
            param: {
              ...param,
            },
            sorts: {
              ...sorts,
              timer
            }
          }
        });
      }
    },
    columns: [
      {
        title: '基金名称',
        dataIndex: 'projectName',
        optType: 'Link'
      }, {
        title: '基金地址',
        dataIndex: 'lastOperationTime',//字段名
      }, {
        title: '基金类型',
        dataIndex: 'stageName',//字段名
      }, {
        title: '法律组织形式',
        dataIndex: 'projectManagerName',//字段名
      }, {
        title: '注册资本（万元）',
        dataIndex: 'fundName',//字段名
      }, {
        title: '基金阶段',
        dataIndex: 'stageList',//字段名
      }, {
        title: '基金发起人',
        dataIndex: 'createdName',//字段名
      }, {
        title: '最后跟进时间',
        // sorter: (a, b) => {

        // sortOrder:  'name',
        sorter: true,
        dataIndex: 'createdOn',
      }
    ],
    // rowSelection: null,
    pageParam: {
      current: pageParam.pageNo,
      pageSize: pageParam.pgeSize,
      onShowSizeChange: (current, pageSize) => {
        console.log('Current: ', current, '; PageSize: ', pageSize);
        dispatch({
          type: actionTypeHead + 'fetch',
          payload: {
            pageParam: {
              pageNo: 1,
              pageSize: pageSize,
            },
            param: {
              ...param,
            }
          }
        });
      },
      onChange: (current) => {
        console.log('Current: ', current);
        dispatch({
          type: actionTypeHead + 'fetch',
          payload: {
            pageParam: {
              ...pageParam,
              pageNo: current,
            },
            param: {
              ...param,
            }
          }
        });
      }
    }
  };
  const tableButtonProps = {
    optList: [
      {
        text: '新建', icon: 'plus', type: 'add'
      },
      {
        text: '筛选', icon: 'filter', type: 'filter'
      }
    ],
    handles: {
      addHandle: (e) => {
        dispatch(routerRedux.push('/home/add/0'));
      },
      filterHandle: (e) => {
        dispatch({
          type: actionTypeHead + 'filterBoxShowFlagChange',
          payload: {
            filterBoxShowFlag: !filterBoxShowFlag
          }
        });
      }
    }
  };
  const labelList = [
    {text: '全部', value: ''},
    {text: '进行中', value: '0'},
    {text: '已完成', value: '1'},
  ];

  const pageLabelProps = {
    current: 1,
    labelList: labelList,
    onClick: ({key, item}) => {
    }
  };
  const filterBoxProps = {
    showFlag: filterBoxShowFlag,
    advance: {
      fileds: [
        {
          name: 'stageId',
          label: '基金阶段',
          text: '选择项基金阶段',
          options: foundStage,
          multiple: false,//支持多选
          type: 'select'
        },
        {
          name: 'q',
          label: '基金名称',
          text: '请输入基金名称',
          type: 'default'
        },
        {
          name: 'createdName',
          label: '基金发起人',//fundList
          text: '请输入基金发起人',
          type: 'default'
        },
        {
          name: 'startUpdatedOn',//startUpdatedOn    endUpdatedOn
          label: '跟进起止时间',
          options: [
            {text: '开始时间'},
            {text: '结束时间'},
            // {text: '当前日期'}
          ],
          type: 'dateComp'
        }
      ],
      handle: function () {
        dispatch({
          type: actionTypeHead + 'fetch',
          payload: {
            pageParam: {...pageParam, pageNo: 1},
            param: {...param, ...filterParam},
            sorts: {...sorts}
          }
        });
      },
      reset: () => {
        dispatch({
          type: actionTypeHead + 'fetch',
          payload: {
            pageParam: {...pageParam, pageNo: 1},
            param: {...param, ...filterParam},
            sorts: {...sorts}
          }
        });
      },
      fieldHandle: (name, value) => {
        dispatch({
          type: actionTypeHead + 'setFilterParam',
          payload: {
            name: name,
            value: value
          }
        })
      }
    }
  };
   return (
     <div>
       <Breadcrumb className={style.normal} {...Breadcrumbs} ></Breadcrumb>
       <div className={style.content}>
         <RelativeBox>
           {/*<PageLabel {...pageLabelProps} />*/}
           <TableButton {...tableButtonProps}>
             <FilterBox {...filterBoxProps}/>
           </TableButton>
         </RelativeBox>
         <div style={{paddingTop: "44px"}}>
         <TableView {...tableViewProps} contentMenuProps={null} dataSource={{datas: dataSource, total: total}}/>
         </div>
       </div>
     </div>
   )
}
function state({list}) {
 return { list }
};
export default connect(state)(list)
